<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">


<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../static/userinfoPrivate/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../static/css/thesame.css" media="all">
    <link rel="stylesheet" href="../static/css/footer.css" media="all">
    <link rel="stylesheet" href="../static/css/drugs/rightCon.css" media="all">
    <link rel="stylesheet" href="../static/userinfoPrivate/layer/theme/default/layer.css" media="all">
    <link rel="stylesheet" href="../static/layui/css/modules/layer/default/layer.css" media="all">
    <style>
        /* 用药管理-新增药物 */
        .layui-time-img input, .layui-time {
            background: url(../static/img/icon_time.png) no-repeat right 10px center;
            width: 100%;
        }
    </style>
</head>

<body class="layui-layout-body">
<div class="layui-body">
    <div class="add-title pad25px"><span class="mr10px cursor return"><img src="../static/img/return_icon.png"></span><span>新增药物发放</span></div>
    <div class="new-add-box new-add-box-width bgWhite box-shadows border-radius4">
        <div class="add-box-scroll">
            <div class="mar25px">
                <ul class="lh32px medicine-con">
                    <li>
                        <div>
                            <label class="fb"><em class="red">*</em>药物名称：</label>
                        </div>
                        <div>
                            <input type="text" placeholder="请输入药物名称" id="meicineName" maxlength="50">
                        </div>
                    </li>
                    <li>
                        <div>
                            <label class="fb">剂量：</label>
                        </div>
                        <div>
                            <input type="text" placeholder="请输入剂量" id="meicineDosage" maxlength="10">
                        </div>
                    </li>
                    <li>
                        <div>
                            <label class="fb"><em class="red">*</em>服药时间：</label>
                        </div>
                        <div class="layui-form">
                            <p>
                                <span><input type="checkbox" id="morning" name="morning" lay-skin="primary" title="早上8点"></span>
                                <em><input id="morningCount" onchange="morning()" type="text" placeholder="请输入药物数量" maxlength="10"></em>
                            </p>
                            <p>
                                <span><input type="checkbox" id="noon" name="chek" lay-skin="primary" title="中午12点"></span>
                                <em><input id="noonCount" onchange="noon()" type="text" placeholder="请输入药物数量" maxlength="10"></em>
                            </p>
                            <p>
                                <span><input type="checkbox" id="afternoon" name="chek" lay-skin="primary" title="下午4点"></span>
                                <em><input id="afternoonCount" onchange="afternoon()" type="text" placeholder="请输入药物数量" maxlength="10"></em>
                            </p>
                            <p>
                                <span><input type="checkbox" id="night" name="chek" lay-skin="primary" title="晚上8点"></span>
                                <em><input id="nightCount" onchange="night()" type="text" placeholder="请输入药物数量" maxlength="10"></em>
                            </p>
                        </div>
                    </li>
                    <li>
                        <div>
                            <label class="fb"><em class="red">*</em>开始时间：</label>
                        </div>
                        <div>
                            <input type="text" id="startDate" placeholder="请选择" class="layui-time test-item" readonly>
                        </div>
                    </li>
                    <li>
                        <div>
                            <label class="fb"><em class="red">*</em>结束时间：</label>
                        </div>
                        <div>
                            <input type="text" id="endDate" placeholder="请选择" class="layui-time test-item" readonly>
                        </div>
                    </li>
                    <li>
                        <div>
                            <label class="fb">备注：</label>
                        </div>
                        <div>
                            <textarea name="" id="remark" cols="30" rows="5" maxlength="200"></textarea>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div class="layui-footer layui-footer-one">
    <div class="btn-con textCenter">
        <span class="btn-one cursor return">返&nbsp;回</span>
        <span class="btn-two cursor" onclick="grant()">提&nbsp;交</span>
    </div>
</div>
<script src="../static/js/jquery-2.1.3.min.js"></script>
<script src="../static/layui/layui.js" charset="utf-8"></script>

<script th:inline="javascript">

    var userNo = [[${userNo}]]

    $(function () {
        layui.use(['laydate', 'form'], function () {
            var laydate = layui.laydate;
            lay('.test-item').each(function () {
                laydate.render({
                    elem: this,
                    trigger: 'click',
                });
            });
        });

        $(".return").click(function () {
            window.history.back();
        });


        // $("input[type='checkbox'][name='morning']").prop("checked", true);

    });


    function grant() {

        var meicineName = $("#meicineName").val();
        var meicineDosage = $("#meicineDosage").val();
        var morningCount = $("#morningCount").val();
        var noonCount = $("#noonCount").val();
        var afternoonCount = $("#afternoonCount").val();
        var nightCount = $("#nightCount").val();
        var startDate = $("#startDate").val();
        var endDate = $("#endDate").val();
        var remark = $("#remark").val();


        if (isNull(meicineName)) {
            layer.msg("请输入药名")
            return;
        }

        var newVar = $("input[type='checkbox']").is(':checked');

        if (newVar == false) {
            layer.msg("请输入服药时间")
            return;
        }

        if ($("input#morning").is(":checked")) {
            if (!morningCount) {
                layer.msg("请输入药物数量")
                return;
            }
        }

        if ($("input#noon").is(":checked")) {
            if (!noonCount) {
                layer.msg("请输入药物数量")
                return;
            }
        }

        if ($("input#afternoon").is(":checked")) {
            if (!afternoonCount) {
                layer.msg("请输入药物数量")
                return;
            }
        }

        if ($("input#night").is(":checked")) {
            if (!nightCount) {
                layer.msg("请输入药物数量")
                return;
            }
        }


        if (isNull(startDate)) {
            layer.msg("请输入开始时间")
            return;
        }


        if (isNull(endDate)) {
            layer.msg("请输入结束时间")
            return;
        }

        if (endDate < startDate) {
            layer.msg("结束时间需大于开始时间")
            return;
        }


        var data = {
            meicineName: meicineName, meicineDosage: meicineDosage, morningCount: morningCount, noonCount: noonCount,
            afternoonCount: afternoonCount, nightCount: nightCount, startDate: startDate, userNo: userNo,
            endDate: endDate, remark: remark
        };

        $.ajax({
            url: "../meicinedistribution/addMeicineDistribution",
            type: "post",
            async: false,
            dataType: "json",
            data: data,
            success: function (result) {
                if (result.code == 200) {
                    layer.alert("保存成功", function () {
                        window.location.href = "../medicine/toGrantPage?userNo=" + userNo;
                    })
                } else {
                    layer.msg(result.msg);
                }
            }
        })
    }


    function isNull(value) {
        return value == null || value === "" || value === undefined;
    }

    function morning() {
        var val = $("#morningCount").val();
        $("#morning").siblings().addClass("layui-form-checked")
        if (isNull(val)) {
            $("#morning").siblings().removeClass("layui-form-checked")
        }
    }

    function noon() {
        $("#noon").siblings().addClass("layui-form-checked")
        var val = $("#noonCount").val();
        if (isNull(val)) {
            $("#noon").siblings().removeClass("layui-form-checked")
        }
    }

    function afternoon() {
        $("#afternoon").siblings().addClass("layui-form-checked")
        var val = $("#afternoonCount").val();
        if (isNull(val)) {
            $("#afternoon").siblings().removeClass("layui-form-checked")
        }
    }

    function night() {
        $("#night").siblings().addClass("layui-form-checked")
        var val = $("#nightCount").val();
        if (isNull(val)) {
            $("#night").siblings().removeClass("layui-form-checked")
        }
    }


</script>
</body>

</html>
